<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!-- enctype="text/plain"   解决中文乱码-->
<form action="/requestBody" method="post" enctype="text/plain">
    测:试@RequestBody(获取请求体)获取数据<br/>
    用户名: <input name= "userName" value="888"/> <br>
    邮箱: <input name="email" value="888@qq.com"/>
    <input type="submit" value="提交"/>
</form>
<form action="/requestEntity" method="post" enctype="text/plain">
    姓  名: <input name= "name" value="张蛟龙"/> <br>
    年  龄: <input name="age" value="22"/>
    宠  物: <input name="pet.name" value="毛纪"/>
    体  重: <input name="pet.weight" value="66"/>
    <!--    宠  物: <input name="pet" value="毛纪,77"/>-->
    <input type="submit" value="提交"/>
</form>
<a href="/responseBody">ssss</a>


<div id="app">
    <a @click="testAxios" th:href="@{/testAxios}">SpringMVC处理ajax</a>
</div>
<script type="text/javascript" th:src="@{/static/js/vue.js}"></script>
<script type="text/javascript" th:src="@{/static/js/axios.min.js}"></script>
<script type="text/javascript">
<!--    失败了   应该是  没添加依赖-->
    new Vue({
        el:"#app",
        methods:{
            testAxios:function (event) {
                axios({
                    method:"post",
                    url:event.target.href,
                    params:{
                        username:"admin",
                        password:"123456"
                    }
                }).then(function (response) {
                    alert(response.data);
                });
                event.preventDefault();
            }
        }
    });
</script>

</body>
</html>